{extend name="template/base" /}
{block name="style"}
<!--select2样式 start -->
<link href="__LIB__/select2-4.0.3/dist/css/select2.min.css" rel="stylesheet" />
<style>
    .evaluate_top_info{
        background-color: #f5fafe;
        margin-left: 10px;
        margin-right: 10px;
    }
    .evaluate_text{
        text-align: left;
        margin-bottom: 5px;
        margin-left: 10px;
        margin-right: 10px;
        font-weight: normal;
        font-size: 16px;
    }
    .evaluate_info{
        text-align: left;
    }
    .evaluate_info p{
        font-weight: normal;
        font-size: 16px;
        min-width: 200px;
        max-width: 350px;
    }
    .evaluate_bottom_info{
        text-align: left
    }
    .evaluate_bottom_info p{
        font-weight: normal;
        font-size: 16px;
        margin-left: 10px;
        margin-right: 10px;
    }
    .img_nav{
        padding: 10px;
    }
    img{
        margin: 10px;
        width: 150px;
        /*height: auto;*/
        height: 100px;
    }
    .mr-b-10{
        margin-bottom: 10px;
    }
    .is_show{
        display: block;
    }
</style>
<!--select2样式 end -->
{/block}
{block name="content"}
<?php use think\Db;?>

<div class="page-container">
    <form id="form" method="post" action="{:\\think\\Request::instance()->baseUrl()}">
        <table class="table table-border table-bordered table-hover table-bg mt-20" style="margin-bottom: 25px">
            <thead>
            <tr class="text-c">
                <th width="">派车单号</th>
                <th width="">出行日期</th>
                <th width="">线路名称</th>
                <th width="">天数</th>
                <th width="">实际打款</th>
                <th width="">预支付标准</th>
                <th width="">司机</th>
                <th width="">车型</th>
                <th width="">起始油表</th>
                <th width="">结束油表</th>
                <th width="">起始里程</th>
                <th width="">结束里程</th>
                <th width="">过路费</th>
                <th width="">加油费</th>
                <th width="">停车费</th>
                <th width="">洗车费</th>
                <th width="">其他</th>
                <th width="">报销</th>
                <th width="">抵消</th>
                <th width="">备注</th>
                <th width="70">操作</th>
            </tr>
            </thead>
            <tbody>
            <tr class="text-c">
                <td>{$list.group_id}</td>
                <td>{:date('Y-m-d',$list.go_date)}</td>
                <td>{$list.title}</td>
                <td>{$list.day}</td>
                <td>{$list.actual_money}</td>
                <td>
                    <span id="prepaid_expenses_c">{$list.prepaid_expenses}</span>
                    <input class="input-text" type="text" id="prepaid_expenses" name="prepaid_expenses" value="{$list.prepaid_expenses}" style="display: none">
                </td>
                <td>{$list.realname}</td>
                <td>{$list.car_type}</td>
                <td>
                    <span id="start_gauge_value_c">{$list.start_gauge_value}</span>
                    <input class="input-text" type="text" id="start_gauge_value" name="start_gauge_value" value="{$list.start_gauge_value}" style="display: none">
                </td>
                <td>
                    <span id="end_gauge_value_c">{$list.end_gauge_value}</span>
                    <input class="input-text" type="text" id="end_gauge_value" name="end_gauge_value" value="{$list.end_gauge_value}" style="display: none">
                </td>
                <td>
                    <span id="start_odometer_value_c">{$list.start_odometer_value}</span>
                    <input class="input-text" type="text" id="start_odometer_value" name="start_odometer_value" value="{$list.start_odometer_value}" style="display: none">
                </td>
                <td>
                    <span id="end_odometer_value_c">{$list.end_odometer_value}</span>
                    <input class="input-text" type="text" id="end_odometer_value" name="end_odometer_value" value="{$list.end_odometer_value}" style="display: none">
                </td>
                <td>{$list.road_toll}</td>
                <td>{$list.oil_cost}</td>
                <td>{$list.parking_fee}</td>
                <td>{$list.car_washing_fee}</td>
                <td>{$list.rests_cost}</td>
                <td>{$list.reimbursement}</td>
                <td>{$list.offset}</td>
                <td>{$list.remark}</td>
                <td class="f-14">
                    <a title="修改信息" href="javascript:;" id="edit" onclick="edit(this)" class="label label-warning radius" >修改信息</a>
                    <a title="取消修改" href="javascript:;" id="canelEdit" onclick="canelEdit(this)" style="display: none" class="label label-warning radius" >取消修改</a>
                </td>
            </tr>
            </tbody>
        </table>
        <div id="edit_btn" class="row cl" style="text-align: center;display: none">
            <input type="hidden" name="group_id" value="{$list.group_id}">
            <div class="col-xs-8 col-sm-9 col-xs-offset-2 col-sm-offset-1">
                <button type="button" class="btn btn-primary radius" onclick="submitSriver()">&nbsp;&nbsp;提交&nbsp;&nbsp;</button>
            </div>
        </div>
    </form>
</div>


{/block}
{block name="script"}

<!--时间插件-->
<script type="text/javascript" src="__LIB__/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="__LIB__/Validform/5.3.2/Validform.min.js"></script>
<script type="text/javascript" src="__LIB__/template/template.js"></script>
<!--select2 js 插件-->
<script type="text/javascript" src="__LIB__/select2-4.0.3/dist/js/select2.min.js"></script>
<script type="text/javascript" src="__LIB__/layer/2.4/layer.js"></script>
<script>
    // 显示编辑输入框
    function edit(obj, id) {
        $("#prepaid_expenses_c").css('display','none');
        $("#start_gauge_value_c").css('display','none');
        $("#end_gauge_value_c").css('display','none');
        $("#start_odometer_value_c").css('display','none');
        $("#end_odometer_value_c").css('display','none');
        $("#prepaid_expenses").css('display','inline');
        $("#start_gauge_value").css('display','inline');
        $("#end_gauge_value").css('display','inline');
        $("#start_odometer_value").css('display','inline');
        $("#end_odometer_value").css('display','inline');
        // 隐藏编辑按钮，显示提交和取消按钮
        $("#canelEdit").css('display','inline');
        $("#edit_btn").css('display','inline');
        $(obj).css('display','none');
    }

    // 取消编辑
    function canelEdit(obj, id) {
        $("#prepaid_expenses_c").css('display','inline');
        $("#start_gauge_value_c").css('display','inline');
        $("#end_gauge_value_c").css('display','inline');
        $("#start_odometer_value_c").css('display','inline');
        $("#end_odometer_value_c").css('display','inline');
        $("#prepaid_expenses").css('display','none');
        $("#start_gauge_value").css('display','none');
        $("#end_gauge_value").css('display','none');
        $("#start_odometer_value").css('display','none');
        $("#end_odometer_value").css('display','none');
        // 显示编辑按钮，隐藏提交和取消按钮
        $("#edit").css('display','inline');
        $("#edit_btn").css('display','none');
        $(obj).css('display','none');
    }

    function open_img(src) {
        window.open(src);
    }
    function submitSriver() {
        $.ajax({
            type: 'post',
            url: '/admin/dispatch_traveler_group/prepayment',
            data: $('#form').serializeArray(),
            success: function (data) {
                console.log('data', data);
                if (data.code == 0) {
                    layer.msg(data.msg, {
                        icon: 1,
                        time: 2000 //2秒关闭（如果不配置，默认是3秒）
                    }, function () {
                        window.parent.location.reload();
                        var index = parent.layer.getFrameIndex(window.name); //获取窗口索引\
                        parent.layer.close(index)
                    });
                } else {
                    layer.msg(data.msg, {
                        icon: 5,
                        time: 2000 //2秒关闭（如果不配置，默认是3秒）
                    });
                }
            },
            error: function (data) {
                layer.msg(data.msg, {
                    icon: 5,
                    time: 2000 //2秒关闭（如果不配置，默认是3秒）
                });
                console.log('data', data);
            }
        });
        return false
    }
</script>
{/block}
